﻿<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" lang="zh-CN" xmlns:th="http://www.thymeleaf.org" xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="author" th:content="${GLOBAL.BLOG_AUTHOR}">
<title th:text="${photo.getName()}+'-'+${GLOBAL.BLOG_TITLE}"></title>
<link rel="stylesheet" type="text/css" th:href="@{css/photo.css}" />
<link rel="stylesheet" th:href="@{/vendor/bootstrap/css/bootstrap.min.css(v=3.3.7)}">
<link rel="stylesheet" th:href="@{/vendor/aos/aos.css(v=2.3.4)}">
<link rel="stylesheet" th:href="@{/css/style.css(v=1.0.4)}">
<link rel="stylesheet" th:href="@{/vendor/highslide/highslide.css(v=5.0.0)}">
<link rel="stylesheet" th:href="@{/vendor/font-awesome/css/font-awesome.min.css(v=4.7.0)}">
<link rel="stylesheet" th:href="@{/vendor/live2d/css/live2d.css}" />
<script th:src="@{/vendor/jquery/jquery.min.js(v=3.2.1)}"></script>
<script th:src="@{/vendor/bootstrap/js/bootstrap.min.js(v=3.3.7)}"></script>
<script th:src="@{/vendor/aos/aos.js(v=2.3.4)}"></script>
<script th:src="@{/vendor/highslide/highslide-full.min.js(v=5.0.0)}"></script>
<th:block th:unless="${#strings.isEmpty(GLOBAL.BLOG_HEAD)}">
	[(${GLOBAL.BLOG_HEAD})]
</th:block>
</head>
<body>
<!-- 背景轮播图功能 -->
<section class="hidden-xs">
	<ul class="cb-slideshow">
		<script th:inline="javascript">
			var backgroundList=/*[[${GLOBAL.BACKGROUND_LIST}]]*/ "";
			backgroundList=JSON.parse(backgroundList);
			var duration=backgroundList.length*6;
			for (var i in backgroundList) {
				document.write("<li style='list-style-type:none;'><span style='background-image: url("+backgroundList[i]+");animation:imageAnimation "+duration+"s linear infinite "+i*6+"s;-webkit-animation:imageAnimation "+duration+"s linear infinite "+i*6+"s;'></span></li>");
			}
		</script>
	</ul>
</section>
<header layout:replace="~{common/header}"></header>
<dl style="margin-top: 200px;">
	<dt></dt>
	<dd>
		<img th:src="@{'http://photo.isxrj.cn/me14.jpg+myphoto'}"/>
	</dd>
	<dd>
		<img th:src="@{'http://photo.isxrj.cn/me13.jpg+myphoto'}"/>
	</dd>
	<dd>
		<img th:src="@{'http://photo.isxrj.cn/me12.jpg+myphoto'}"/>
	</dd>
	<dd>
		<img th:src="@{'http://photo.isxrj.cn/me4.jpg+myphoto'}"/>
	</dd>
	<dd>
		<img th:src="@{'http://photo.isxrj.cn/me11.jpg+myphoto'}"/>
	</dd>
	<dd>
		<img th:src="@{'http://photo.isxrj.cn/me9.jpg+myphoto'}"/>
	</dd>
	<dd>
		<img th:src="@{'http://photo.isxrj.cn/me7.jpg+myphoto'}"/>
	</dd>
	<dd>
		<img th:src="@{'http://photo.isxrj.cn/me8.jpg+myphoto'}"/>
	</dd>
	<dd>
		<img th:src="@{'http://photo.isxrj.cn/me15.jpg+myphoto'}"/>
	</dd>
</dl>
<div layout:replace="~{common/live2d}"></div>
<footer layout:replace="~{common/footer}"></footer>
<script th:src="@{js/script.js}"></script>
<audio id="audio" th:src="@{'http://mp.isxrj.cn/m1.mp3'}" style="opacity:0" preload="auto" controls loop hidden="true"/>
</body>
</html>
<script>
var myAuto = document.getElementById('audio');
myAuto.play();
</script>